<template>
    <div class="city">
        <city-head></city-head>
        <city-search :cities="cities"></city-search>
        <city-list :cities="cities" :hotCities="hotCities" ></city-list>
        <city-word :cities="cities" ></city-word>
    </div>
</template>
<script>

import {CityModel} from '../../models/CityModel'
const citymodel = new CityModel()
import CityHead from './components/Head'
import CitySearch from './components/Search'
import CityList from './components/List'
import CityWord from './components/Word'
export default {
    name:"city",
    components:{
        CityHead,
        CitySearch,
        CityList,
        CityWord
    },
    data() {
        return {
            cities:[],
            hotCities:[],
        }
    },
    mounted(){
        citymodel.getCity().then(res=>{
            console.log(res)
            let {cities,hotCities} = res.data.data;
            this.cities = cities;
            this.hotCities = hotCities
        })
    },
}
</script>
<style lang="scss" scoped>
    .city{
        background: #FFF;
    }
</style>
